﻿@model Course

@{
    ViewBag.Title = Model.Name;
}

<div class="page-header">
    <h1><span class="glyphicon glyphicon-globe"></span> @ViewBag.Title</h1>
</div>
<div class="row">
    <div class="col-sm-6">
        <h4>Adresse</h4>
        @Model.Address<br>
        @Model.ZipCode @Model.City<br>
        @Model.CountryCodeISO3166Alpha2<br>

        @Html.ActionLink("ret", "Edit", new { id = Model.Id })
    </div>

    <div class="col-sm-6">
        <h4>Vejr info</h4>
        <div id="geo" class="geo">
        </div>
    </div>
</div>

<hr />
<h3>Tees</h3>
<table class="table table-hover">
    <tr>
        <th>navn</th>
        <th>sløjfe/bane</th>
        <th>m/k</th>
        <th>par</th>
        <th>cr</th>
        <th>slope</th>
        <th>meter</th>
        <th>aktiv?</th>
    </tr>
    @if (Model.Tees != null)
    {
        foreach (Tee tee in Model.Tees.OrderByDescending(a => a.IsActive))
        {
            <tr>
                <td>@Html.ActionLink(tee.Name, "Edit", "Tee", new { id = tee.Id }, null)</td>
                <td>@tee.Description</td>
                <td>@tee.Gender</td>
                <td>@tee.Par</td>
                <td>@tee.CR</td>
                <td>@tee.Slope</td>
                <td>@tee.Length</td>
                <td>@(tee.IsActive ? "Ja" : "Nej")</td>
            </tr>
        }
    }
    else
    {
        <p>Der er ikke oprettet tees for denne bane.</p>
    }
</table>

@Html.ActionLink("Opret ny tee", "CreateForCourse", "Tee", new { id = Model.Id }, null)


@section Scripts {
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=weather"></script>
    <script>
        // course address
        var geoAddress = "@Html.Raw(Model.GeoAddress)";
                
        theCup.getGeoLocForAddress(geoAddress, success);
        
        function success(data) {
            // data
            var result = data.results[0];
            var loc = result.geometry.location;
            
            initialize(loc);
        }

        function initialize(loc) {
            var mapOptions = {
                zoom: 10,
                disableDoubleClickZoom: true,
                disableDefaultUI: true,
                center: new google.maps.LatLng(loc.lat, loc.lng)
            };

            var map = new google.maps.Map(document.getElementById('geo'),
                mapOptions);

            var weatherLayer = new google.maps.weather.WeatherLayer({
                temperatureUnits: google.maps.weather.TemperatureUnit.CELSIUS,
                winwindSpeedUnits: google.maps.weather.WindSpeedUnit.METERS_PER_SECOND
            });
            weatherLayer.setMap(map);

            //var cloudLayer = new google.maps.weather.CloudLayer();
            //cloudLayer.setMap(map);
            
        }
    </script>
}